/*
 * Copyright 2016 resin.io
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *    http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.page-finish {
  margin-top: -25px;
}

.page-finish .button-label {
  margin: 0 auto $spacing-medium;

  // Keep some spacing at the sides
  max-width: $btn-min-width - 5px;
}

.page-finish .button-primary {
  min-width: $btn-min-width;
}

.page-finish .title {
  color: $palette-theme-dark-foreground;
  font-weight: bold;
}

.page-finish .huge-title {
  font-size: 3.5em;
}

.page-finish .label {
  display: inline-block;

  > b {
    color: $palette-theme-dark-soft-foreground;
    font-family: monospace;
  }
}

.page-finish .soft {
  color: $palette-theme-dark-soft-foreground;
}

.page-finish .separator-xs {
  flex-grow: 0;
  background-color: $palette-theme-dark-soft-background;
  padding: 0px;
  min-width: 2px;
}

.page-finish .center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-finish .box > div {
  margin-bottom: 20px;

  > button {
    margin-right: 20px;
  }
}

.page-finish webview {
  width: 800px;
  height: 300px;
  position: absolute;
  top: 80px;
  left: 0;
  z-index: 9001;
}

.page-finish .fallback-banner {
  padding-top: 35px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 300px;
  position: absolute;
  top: 125px;
  left: 0;
  background-color: $palette-theme-dark-background;
  color: $palette-theme-dark-foreground;
  font-weight: 300;

  .caption {
    display: flex;
    font-weight: normal;
  }

  .caption-big {
    font-size: 30px;
  }

  .caption-small {
    font-size: 20px;
    padding: 15px;
  }

  .footer-right {
    padding: 0;
    border-bottom: 1px dashed;
  }

  .svg-icon {
    margin-left: 0.3em;
    margin-right: 0.3em
  }

  .section-footer {
    border-top: none;
    height: 39px;
  }
}
